import React, { useEffect, useState } from "react"
import Heand from "../component/heand"
import { isLogined } from "./auth"
import { useNavigate } from "react-router-dom"
import axios from 'axios'
import Sp from "../component/zhanshi";
import get from "../api/api"
import { Input,Button } from "antd"



function Dianpu() {
    const navigate = useNavigate()


    const row = []
    const [listt, setListt] = useState('')
    const gly = 1
    const people_Id = sessionStorage.getItem('username')
    const [newphone,setNewphone]=useState('')
    const [newqq,setNewqq]=useState('')
    const [newpeople, setNewpeople] = useState('')
    const goxq = (objectid) => {
        navigate(`/${objectid}`, { state: { gly } })
    }


    const people_id = sessionStorage.getItem('username')
    useEffect(() => {

        if (isLogined() === false) {

            navigate('/login')
        }

        axios.get(`https://r5ctn9z9.lc-cn-n1-shared.com/1.1/classes/bscs?where={"people_id":"${people_id}"}`, {
            headers: {
                " X-LC-Id": "r5CTN9z96pCW8mI8fx9YxOmw-gzGzoHsz",
                "X-LC-Key": "8gSsl4Sz0ILMiQeMNMA8xQqg",
                // "Content-Type": "application/json"
            }
        })
            .then((res) => {
                setListt(res.data.results

                )

                console.log(res);
                console.log(listt)


            })
            .catch((error) => {
                console.log(error);
            });


        axios.get(`https://r5ctn9z9.lc-cn-n1-shared.com/1.1/classes/people?where={"username":"${people_Id}"}`, {
            headers: {
                " X-LC-Id": "r5CTN9z96pCW8mI8fx9YxOmw-gzGzoHsz",
                "X-LC-Key": "8gSsl4Sz0ILMiQeMNMA8xQqg",
                "Content-Type": "application/json"
            }
        }).then((res) => {
            setNewpeople(res.data.results[0])
            console.log(res)
        })
    }, []);


    // console.log(listt)
    // if (listt === null) {
    //     return 'Loding...'
    // }


    (listt || []).forEach((item) => {
        row.push(
            <li onClick={() => goxq(item.objectId)} className="myhomeli" key={item.objectId}>

                <Sp className="image" key={item.objectId} image={item.image} xiangqing={item.xiangqing} price={item.price} />
            </li>

        )
    });
    const [peopleid,setPeople]=useState('')
    useEffect(()=>{
        axios.get(`https://r5ctn9z9.lc-cn-n1-shared.com/1.1/classes/people?where={"username":"${people_Id}"}`,{
            headers:{
                " X-LC-Id": "r5CTN9z96pCW8mI8fx9YxOmw-gzGzoHsz",
                "X-LC-Key": "8gSsl4Sz0ILMiQeMNMA8xQqg",
                'Content-Type': 'application/json'
            }
        }).then((res)=>{
            console.log(res)
            if(res.data.results.length!==0){
                setPeople(res.data.results[0].objectId)
            }
            
        })
    },[])

   const handnewphone = (event)=>{
        setNewphone(event.target.value)
   }
   const handnewqq= (event)=>{
        setNewqq(event.target.value)
   }
const handNewPhone = async (event)=>{
    event.preventDefault();
    try {
        const response = await axios.put(`https://r5ctn9z9.lc-cn-n1-shared.com/1.1/classes/people/${peopleid}`, {
            phone:newphone
        }, {
            headers: {
                " X-LC-Id": "r5CTN9z96pCW8mI8fx9YxOmw-gzGzoHsz",
                "X-LC-Key": "8gSsl4Sz0ILMiQeMNMA8xQqg",
                'Content-Type': 'application/json'
            }
        }).then((e) => {
            console.log(e.data); // 处理返回的数据
            //   setShowInput(false);

            window.location.reload()

          


            // 更新展示的数据
        })


    } catch (error) {
        console.error(error);
    }
}
const handNewQq = async (event)=>{
    event.preventDefault();
    try {
        const response = await axios.put(`https://r5ctn9z9.lc-cn-n1-shared.com/1.1/classes/people/${peopleid}`, {
            qq:newqq
        }, {
            headers: {
                " X-LC-Id": "r5CTN9z96pCW8mI8fx9YxOmw-gzGzoHsz",
                "X-LC-Key": "8gSsl4Sz0ILMiQeMNMA8xQqg",
                'Content-Type': 'application/json'
            }
        }).then((e) => {
            console.log(e.data); // 处理返回的数据
            //   setShowInput(false);

            window.location.reload()

            


            // 更新展示的数据
        })


    } catch (error) {
        console.error(error);
    }
}

    return (

        <div>
            <Heand />
            <div className="myhome">
                <div className="mylxfs">
                    <div className="dp">我的手机号：{newpeople.phone}</div>
                    <label className="newinput" >

                        <Input className="xqinp" value={newphone} onChange={handnewphone} type="text" />
                    </label>
                    <Button className="xqbt" onClick={handNewPhone} type="submit">更新手机号码</Button>
                    <div className="dp">我的QQ号：{newpeople.qq}</div>
                    <label className="newinput" >

                        <Input className="xqinp" value={newqq} onChange={handnewqq} type="text" />
                    </label>
                    <Button className="xqbt" onClick={handNewQq} type="submit">更新QQ</Button>
                </div>
                < hr className="dphr"/>
                <ul>

                    {row}


                </ul>



            </div>
        </div>
    )
}
export default Dianpu